<template lang="html">
  <div>
    <sui-segment inverted>
      <sui-progress inverted color="red" />
      <sui-progress inverted color="orange" />
      <sui-progress inverted color="yellow" />
      <sui-progress inverted color="olive" />
      <sui-progress inverted color="green" />
      <sui-progress inverted color="teal" />
      <sui-progress inverted color="blue" />
      <sui-progress inverted color="violet" />
      <sui-progress inverted color="purple" />
      <sui-progress inverted color="pink" />
      <sui-progress inverted color="brown" />
      <sui-progress inverted color="grey" />
      <sui-progress inverted color="black" />
    </sui-segment>
  </div>
</template>

<script>
export default {
  name: 'InvertedProgressExample',
};
</script>
